<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Amaze UI Admin index Examples</title>
    <meta name="description" content="这是一个 index 页面">
    <meta name="keywords" content="index">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <link rel="icon" type="image/png" href="/static/admin/i/favicon.png">
    <link rel="apple-touch-icon-precomposed" href="/static/admin/i/app-icon72x72@2x.png">
    <meta name="apple-mobile-web-app-title" content="Amaze UI" />
    <link rel="stylesheet" href="/static/admin/css/amazeui.min.css" />
    <link rel="stylesheet" href="/static/admin/css/amazeui.datatables.min.css" />
    <link rel="stylesheet" href="/static/admin/css/app.css">
    <script src="/static/admin/js/jquery.min.js"></script>
    {load href="/static/admin/css/bootstrap.min.css"}
    {js href="/static/admin/js/jquery.min.js"}
    {js href="/static/admin/js/bootstrap.min.js"}
</head>

<body data-type="widgets">
    <script src="/static/admin/js/theme.js"></script>
    <div class="am-g tpl-g">
        <!-- 头部导航栏 -->
        {include file="public/header" /}
        <!-- 侧边导航栏 -->
        {include file="public/left" /}


        <!-- 内容区域 -->
        <div class="tpl-content-wrapper">
            <div class="row-content am-cf">
                <div class="row">
                    <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
                        <div class="widget am-cf">
                            <div class="widget-head am-cf">
                                <div class="widget-title  am-cf">权限列表</div>
                            </div>
                            <div class="checkbox row">
                                <div class="col-md-12">
                                    <div class="col-md-3">
                                        <table class="table table-hover">
                                            <thead>
                                                <tr>
                                                    <th>ID</th>
                                                    <th>权限类别</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                {volist name="list" id="v" mod="4"}
                                                {eq name="mod" value="0"}
                                                <tr>
                                                    <td>{$v['id']}</td>
                                                    <td>
                                                        <label>
                                                            <input type="checkbox" id="checkbox" class="checkbox" role-id="{$id}" power-id="{$v['id']}" value="" {:in_array($v['id'],$power) ? 'checked' :'' } >{$v['power']}
                                                        </label>
                                                    </td>
                                                </tr>
                                                {/eq}
                                                {/volist}
                                                <!-- more data -->
                                            </tbody>
                                        </table>
                                    </div>
                                    <div class="col-md-3">
                                        <table class="table table-hover">
                                            <thead>
                                                <tr>
                                                    <th>ID</th>
                                                    <th>权限类别</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                {volist name="list" id="v" mod="4"}
                                                {eq name="mod" value="1"}
                                                <tr>
                                                    <td>{$v['id']}</td>
                                                    <td>
                                                        <label>
                                                            <input type="checkbox" id="checkbox" class="checkbox" role-id="{$id}" power-id="{$v['id']}" value="" {:in_array($v['id'],$power) ? 'checked' :'' } >{$v['power']}
                                                        </label>
                                                    </td>
                                                </tr>
                                                {/eq}
                                                {/volist}
                                                <!-- more data -->
                                            </tbody>
                                        </table>
                                    </div>
                                    <div class="col-md-3">
                                        <table class="table table-hover">
                                            <thead>
                                                <tr>
                                                    <th>ID</th>
                                                    <th>权限类别</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                {volist name="list" id="v" mod="4"}
                                                {eq name="mod" value="2"}
                                                <tr>
                                                    <td>{$v['id']}</td>
                                                    <td>
                                                        <label>
                                                            <input type="checkbox" id="checkbox" class="checkbox" role-id="{$id}" power-id="{$v['id']}" value="" {:in_array($v['id'],$power) ? 'checked' :'' } >{$v['power']}
                                                        </label>
                                                    </td>
                                                </tr>
                                                {/eq}
                                                {/volist}
                                                <!-- more data -->
                                            </tbody>
                                        </table>
                                    </div>
                                    <div class="col-md-3">
                                        <table class="table table-hover">
                                            <thead>
                                                <tr>
                                                    <th>ID</th>
                                                    <th>权限类别</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                {volist name="list" id="v" mod="4"}
                                                {eq name="mod" value="3"}
                                                <tr>
                                                    <td>{$v['id']}</td>
                                                    <td>
                                                        <label>
                                                            <input type="checkbox" id="checkbox" class="checkbox" role-id="{$id}" power-id="{$v['id']}" value="" {:in_array($v['id'],$power) ? 'checked' :'' } >{$v['power']}
                                                        </label>
                                                    </td>
                                                </tr>
                                                {/eq}
                                                {/volist}
                                                <!-- more data -->
                                            </tbody>
                                        </table>
                                    </div>    
                                </div>
                                <div class="am-u-lg-12 am-cf">

                                    <div class="am-fr">
                                        <ul class="am-pagination tpl-pagination">
                                            <li class="am-disabled"><a href="#">«</a></li>
                                            <li class="am-active"><a href="#">1</a></li>
                                            <li><a href="#">2</a></li>
                                            <li><a href="#">3</a></li>
                                            <li><a href="#">4</a></li>
                                            <li><a href="#">5</a></li>
                                            <li><a href="#">»</a></li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </div>
    <!-- Modal -->

    <script src="/static/admin/js/amazeui.min.js"></script>
    <script src="/static/admin/js/app.js"></script>
    <script>
        $(function(){
            $('input:checkbox').click(function (){
                var role_id = $(this).attr('role-id');
                var power_id = $(this).attr('power-id');
                var obj = $(this).parents('tr');
                //console.log(role_id + power_id);
                editAjax(role_id , power_id);
            });
        });
       // AJAX修改
        function editAjax(role_id,power_id) {
            $.ajax({
                type: 'post',
                url : '/adminRoleDoeditpower/',
                dataType : 'json',
                data:{"role_id":role_id,"power_id":power_id},
                success : function (data){
                       console.log(data.role_id + data.power_id + data.status);
                },
                error : function () {
                    alert('操作失败!');
                }
            });
        }
    </script>

</body>

</html>